<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <img data-v-46107781="" src="http://127.0.0.1:5500/src/views/play/wst/titleimg/%E6%A0%87%E9%A2%98.jpg" class="article-card__highlight-image lazyLoad isLoaded">
    </div>
</body>
<style>
    div {
        position: relative;
        width: 1000px;
        height: 600px;
        background-color: aqua;
    }

    img {
        --width-base: 543px; /* 视窗宽度的100% */  
        --divisor: 5;
        --height-base: 126px; /* 视窗宽度的100% */  
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: calc(var(--width-base) / var(--divisor)); 
        height: calc(var(--height-base) / var(--divisor));
        z-index: 10000;
    }
</style>

</html>